<template>
    <div class="all">
        <!-- <div style="text-align:center;font-size:28px;font-weight:bold;">{{$route.name}}</div> -->
        <div class="search">
            <el-form ref="form" :model="staffSearch" :inline="true" size="mini">
                <el-form-item label="姓名：">
                    <el-input v-model="staffSearch.name" clearable placeholder="请输入姓名"></el-input>
                </el-form-item>
                <el-form-item label="手机号：">
                    <el-input v-model="staffSearch.phone" clearable placeholder="请输入手机号"></el-input>
                </el-form-item>
                <el-form-item>
                    <el-button type="primary" @click="searchClick(2)">查 询</el-button>
                </el-form-item>
            </el-form>
        </div>
        <div class="btn" v-if="jurisdiction.add_state === 1">
            <el-button size="medium" type="primary" @click="add()">添 加</el-button>
        </div>
        <span v-else></span>
        <div class="table">
            <!-- 表格 -->
            <el-table
                :data="staffTable"
                border
                height="560"
                :style="{width:screenWidth+'px'}"
                :cell-style="cellStyle"
                :header-cell-style="rowClass"
                @selection-change="allSelectionChange"
            >
                <!-- <el-table-column type="selection" width="60px"></el-table-column> -->
                <el-table-column label="编号" width="80px">
                    <template slot-scope="scope">
                        <span>{{ scope.row.id }}</span>
                    </template>
                </el-table-column>
                <el-table-column label="姓名" width="120px">
                    <template slot-scope="scope">
                        <span>{{ scope.row.name }}</span>
                    </template>
                </el-table-column>
                <el-table-column label="手机号" width="120px">
                    <template slot-scope="scope">
                        <span>{{ scope.row.phone }}</span>
                    </template>
                </el-table-column>
                <el-table-column
                    prop="sex"
                    :filters="sexFilterList"
                    :filter-method="sexFilterHandler"
                    label="性别"
                    width="100px"
                >
                    <template slot-scope="scope">
                        <span>{{ scope.row.sex | filsex}}</span>
                    </template>
                </el-table-column>
                <el-table-column label="角色" width="160px">
                    <template slot-scope="scope">
                        <span>{{ scope.row.role | filrole }}</span>
                    </template>
                </el-table-column>
                <el-table-column
                    prop="state"
                    :filters="stateFilterList"
                    :filter-method="stateFilterHandler"
                    label="状态"
                    width="100px"
                >
                    <template slot-scope="scope">
                        <span>{{ scope.row.state | filstate }}</span>
                    </template>
                </el-table-column>
                <el-table-column show-overflow-tooltip label="地址" width="180px">
                    <template slot-scope="scope">
                        <span>{{ scope.row.address }}</span>
                    </template>
                </el-table-column>
                <el-table-column label="入职时间" width="160px">
                    <template slot-scope="scope">
                        <span>{{ scope.row.create_time*1000 | formatDate }}</span><!--  {{ scope.row.create_time*1000 | formatDateBehind }} -->
                    </template>
                </el-table-column>
                <el-table-column label="qq" width="160px">
                    <template slot-scope="scope">
                        <span>{{ scope.row.qq }}</span>
                    </template>
                </el-table-column>
                <el-table-column label="邮箱" width="160px">
                    <template slot-scope="scope">
                        <span>{{ scope.row.email }}</span>
                    </template>
                </el-table-column>
                <el-table-column label="操作" width="240px">
                    <template slot-scope="scope">
                        <el-button
                            v-if="jurisdiction.update_state === 1"
                            size="small"
                            type="primary"
                            @click="edit(scope.$index, scope.row)"
                        >修改</el-button>
                        <el-button
                            size="small"
                            type="warning"
                            @click="detail(scope.$index, scope.row)"
                        >详情</el-button>
                        <el-button
                            v-if="jurisdiction.delete_state === 1"
                            size="small"
                            type="danger"
                            @click="delstaff(scope.$index, scope.row)"
                        >删除</el-button>
                    </template>
                </el-table-column>
            </el-table>

            <!-- 分页 -->
            <el-pagination
                @size-change="pageCount"
                @current-change="currentPageCount"
                :current-page="currentPage"
                :page-sizes="[100,500,1000,1500, 2000]"
                :page-size="currentCount"
                layout="prev, pager, next, jumper, sizes,total"
                :total="pageResultSize"
            ></el-pagination>
        </div>
        <div>
            <!-- 添加对话框 -->
            <el-dialog title="添加" width="60%" :visible.sync="addVisible" center @close="closeAdd">
                <el-form :model="addStaff" :rules="addRules" ref="addStaff">
                    <div class="flex">
                        <el-form-item label="姓名：" prop="name" :label-width="formLabelWidth">
                            <el-input clearable v-model="addStaff.name" placeholder="请输入姓名"></el-input>
                        </el-form-item>
                        <el-form-item label="手机号：" prop="phone" :label-width="formLabelWidth">
                            <el-input clearable v-model="addStaff.phone" placeholder="请输入手机号"></el-input>
                        </el-form-item>
                    </div>
                    <div class="flex">
                        <el-form-item label="性别：" prop="sex" :label-width="formLabelWidth">
                            <el-radio v-model="addStaff.sex" v-for="item in sexFilterList" :key="item.value" :label="item.value">{{item.text}}</el-radio>
                            <!-- <el-radio v-model="addStaff.sex" :label="1">女</el-radio>
                            <el-radio v-model="addStaff.sex" :label="2">男</el-radio> -->
                        </el-form-item>
                        <el-form-item label="状态：" prop="state" :label-width="formLabelWidth">
                            <el-radio v-model="addStaff.state" v-for="item in stateFilterList" :key="item.value" :label="item.value">{{item.text}}</el-radio>
                            <!-- <el-radio v-model="addStaff.state" label="1" >启用</el-radio>
                            <el-radio v-model="addStaff.state" label="2">禁止</el-radio> -->
                        </el-form-item>
                    </div>
                    <div class="flex">
                        <el-form-item label="角色：" prop="role" :label-width="formLabelWidth">
                            <el-select clearable v-model="addStaff.role">
                                <el-option
                                    v-for="(item,index) in roleList"
                                    :key="index"
                                    :label="item.roleValue"
                                    :value="item.role"
                                ></el-option>
                            </el-select>
                        </el-form-item>
                        <el-form-item label="入职时间：" prop="create_time" :label-width="formLabelWidth">
                            <el-date-picker
                                v-model="addStaff.create_time"
                                value-format="yyyy-MM-dd"
                                type="date"
                                placeholder="请选择入职时间"
                            ></el-date-picker>
                        </el-form-item>
                    </div>
                    <div class="flex">
                        <el-form-item label="身份证号：" prop="id_card" :label-width="formLabelWidth">
                            <el-input
                                maxlength="18"
                                clearable
                                v-model="addStaff.id_card"
                                placeholder="请输入身份证号"
                            ></el-input>
                        </el-form-item>
                        <el-form-item label="地址：" prop="address" :label-width="formLabelWidth">
                            <el-input clearable v-model="addStaff.address" placeholder="请输入地址"></el-input>
                        </el-form-item>
                    </div>
                    <div class="flex">
                        <el-form-item label="qq：" prop="qq" :label-width="formLabelWidth">
                            <el-input clearable v-model="addStaff.qq" placeholder="请输入qq"></el-input>
                        </el-form-item>
                        <el-form-item label="邮箱：" prop="email" :label-width="formLabelWidth">
                            <el-input clearable v-model="addStaff.email" placeholder="请输入邮箱"></el-input>
                        </el-form-item>
                        <el-form-item label="登录密码" :label-width="formLabelWidth" prop="password">
                            <el-input v-model="addStaff.password" clearable placeholder="请输入登录密码"></el-input>
                        </el-form-item>
                    </div>
                    <el-form-item label="备注：" :label-width="formLabelWidth">
                        <el-input
                            type="textarea"
                            autosize
                            v-model="addStaff.note"
                            placeholder="请输入备注"
                        ></el-input>
                    </el-form-item>
                </el-form>
                <div slot="footer">
                    <el-button @click="cancelAdd">取 消</el-button>
                    <el-button type="primary" @click="confirmAdd">确 定</el-button>
                </div>
            </el-dialog>
            <!-- 修改对话框 -->
            <el-dialog title="修改" width="60%" :visible.sync="editVisible" center @close="closeEdit">
                <el-form :model="editStaff" :rules="addRules" ref="editStaff">
                    <div class="flex">
                        <el-form-item label="姓名：" prop="name" :label-width="formLabelWidth">
                            <el-input clearable v-model="editStaff.name" placeholder="请输入姓名"></el-input>
                        </el-form-item>
                        <el-form-item label="手机号：" prop="phone" :label-width="formLabelWidth">
                            <el-input clearable v-model="editStaff.phone" placeholder="请输入手机号"></el-input>
                        </el-form-item>
                    </div>
                    <div class="flex">
                        <el-form-item label="性别：" prop="sex" :label-width="formLabelWidth">
                            <el-radio v-model="editStaff.sex" v-for="item in sexFilterList" :key="item.id" :label="item.value">{{item.text}}</el-radio>
                            <!-- <el-radio v-model="editStaff.sex" :label="0">男</el-radio> -->
                        </el-form-item>
                        <el-form-item label="状态：" prop="state" :label-width="formLabelWidth">
                            <el-radio v-model="editStaff.state" v-for="item in stateFilterList" :key="item.value" :label="item.value">{{item.text}}</el-radio>
                            <!-- <el-radio v-model="editStaff.state" label="1">禁止</el-radio> -->
                        </el-form-item>
                    </div>
                    <div class="flex">
                        <el-form-item label="角色：" prop="role" :label-width="formLabelWidth">
                            <el-select clearable v-model="editStaff.role">
                                <el-option
                                    v-for="(item,index) in roleList"
                                    :key="index"
                                    :label="item.roleValue"
                                    :value="item.role"
                                ></el-option>
                            </el-select>
                        </el-form-item>
                        <el-form-item label="入职时间：" prop="create_time" :label-width="formLabelWidth">
                            <!-- <el-date-picker
                                v-model="editStaff.create_time"
                                value-format="yyyy-MM-dd"
                                type="date"
                                placeholder="请选择入职时间"
                            ></el-date-picker> -->
                            <el-date-picker
                                v-model="editStaff.create_time"
                                value-format="yyyy-MM-dd"
                                type="date"
                                placeholder="请选择入职时间"
                            ></el-date-picker>
                        </el-form-item>
                    </div>
                    <div class="flex">
                        <el-form-item label="身份证号：" prop="id_card" :label-width="formLabelWidth">
                            <el-input
                                maxlength="18"
                                clearable
                                v-model="editStaff.id_card"
                                placeholder="请输入身份证号"
                            ></el-input>
                        </el-form-item>
                        <el-form-item label="地址：" prop="address" :label-width="formLabelWidth">
                            <el-input clearable v-model="editStaff.address" placeholder="请输入地址"></el-input>
                        </el-form-item>
                    </div>
                    <div class="flex">
                        <el-form-item label="qq：" prop="qq" :label-width="formLabelWidth">
                            <el-input clearable v-model="editStaff.qq" placeholder="请输入qq"></el-input>
                        </el-form-item>
                        <el-form-item label="邮箱：" prop="email" :label-width="formLabelWidth">
                            <el-input clearable v-model="editStaff.email" placeholder="请输入邮箱"></el-input>
                        </el-form-item>
                        <el-form-item label="登录密码：" prop="email" :label-width="formLabelWidth">
                            <el-input clearable v-model="editStaff.password" placeholder="请输入新的密码"></el-input>
                        </el-form-item>
                    </div>
                    <el-form-item label="备注：" :label-width="formLabelWidth">
                        <el-input
                            type="textarea"
                            autosize
                            v-model="editStaff.note"
                            placeholder="请输入备注"
                        ></el-input>
                    </el-form-item>
                </el-form>
                <div slot="footer">
                    <el-button @click="cancelEdit">取 消</el-button>
                    <el-button type="primary" @click="confirmEdit">确 定</el-button>
                </div>
            </el-dialog>
            <!-- 详情对话框 -->
            <el-dialog title="详情" width="800px" :visible.sync="detailVisible" center @close="closeDetail">
                <el-form :model="detailStaff" label-position="left">
                    <div class="flex-detail">
                        <el-form-item label="姓名：" prop="name" label-width="90px">
                            {{detailStaff.name}}
                            <!-- <el-input clearable v-model="detailStaff.name" placeholder="请输入姓名"></el-input> -->
                        </el-form-item>
                        <el-form-item label="手机号：" prop="phone" label-width="90px">
                            {{detailStaff.phone}}
                            <!-- <el-input clearable v-model="detailStaff.phone" placeholder="请输入手机号"></el-input> -->
                        </el-form-item>
                    </div>
                    <div class="flex-detail">
                        <el-form-item label="性别：" prop="sex" label-width="90px">
                            {{detailStaff.sex | filsex}}
                            <!-- <el-radio v-model="detailStaff.sex" label="1">女</el-radio>
                            <el-radio v-model="detailStaff.sex" label="2">男</el-radio>-->
                        </el-form-item>
                        <el-form-item label="状态：" prop="state" label-width="90px">
                            {{detailStaff.state | filstate }}
                            <!-- <el-radio v-model="detailStaff.state" label="0">启用</el-radio>
                            <el-radio v-model="detailStaff.state" label="1">禁止</el-radio>-->
                        </el-form-item>
                    </div>
                    <div class="flex-detail">
                        <el-form-item label="角色：" prop="role" label-width="90px">
                            {{detailStaff.role | filrole}}
                            <!-- <el-select clearable v-model="detailStaff.role">
                                <el-option
                                    v-for="(item,index) in roleList"
                                    :key="index"
                                    :label="item.role"
                                    :value="item.roleValue"
                                ></el-option>
                            </el-select>-->
                        </el-form-item>
                        <el-form-item label="入职时间：" prop="create_time" label-width="90px">
                            {{detailStaff.create_time*1000 | formatDate}}
                            <!-- <el-date-picker
                                v-model="detailStaff.create_time"
                                type="date"
                                placeholder="请选择入职时间"
                            ></el-date-picker>-->
                        </el-form-item>
                    </div>
                    <div class="flex-detail">
                        <el-form-item label="身份证号：" prop="id_card" label-width="90px">
                            {{detailStaff.id_card}}
                            <!-- <el-input
                                maxlength="18"
                                clearable
                                v-model="detailStaff.id_card"
                                placeholder="请输入身份证号"
                            ></el-input>-->
                        </el-form-item>
                        <el-form-item label="地址：" prop="address" label-width="90px">
                            {{detailStaff.address}}
                            <!-- <el-input clearable v-model="detailStaff.address" placeholder="请输入地址"></el-input> -->
                        </el-form-item>
                    </div>
                    <div class="flex-detail">
                        <el-form-item label="qq：" prop="qq" label-width="90px">
                            {{detailStaff.qq}}
                            <!-- <el-input clearable v-model="detailStaff.qq" placeholder="请输入qq"></el-input> -->
                        </el-form-item>
                        <el-form-item label="邮箱：" prop="email" label-width="90px">
                            {{detailStaff.email}}
                            <!-- <el-input clearable v-model="detailStaff.email" placeholder="请输入邮箱"></el-input> -->
                        </el-form-item>
                    </div>
                    <el-form-item label="备注：" label-width="90px">
                        {{detailStaff.note}}
                        <!-- <el-input
                            type="textarea"
                            autosize
                            v-model="detailStaff.note"
                            placeholder="请输入备注"
                        ></el-input> -->
                    </el-form-item>
                </el-form>
                <!-- <div slot="footer">
                    <el-button @click="cancelEdit">取 消</el-button>
                    <el-button type="primary" @click="confirmEdit">确 定</el-button>
                </div> -->
            </el-dialog>
        </div>
    </div>
</template>

<script>
import "../../../static/scss/page.scss";
import utils from "../../util/request";
import {timetamp} from "../../util/time.js";
import {date} from "../../util/time.js";
import {formatDate} from "../../util/time.js"
var that
export default {
    data() {
        return {
            // 分页
            jurisdiction: null,
            currentPage: 1, //初始页面
            currentCount: 100, //当前页面的数据数量
            pageResultSize: 10, //表格数据总数
            screenWidth: window.innerWidth, //可视宽度
            addVisible: false, //添加对话框
            editVisible: false, //修改对话框
            detailVisible:false, //详情对话框
            formLabelWidth: "120px", //表单label宽度
            addStaff: {
                //添加对话框表单
                name:"",	//姓名
                phone:"",	//手机号
                sex: "",	//性别，0男，1女
                role: "",   //角色，1执行总助理，2财务经理...
                state:"",	//状态，0禁止，1正常
                address:"",	//是	NULL	地址
                create_time:"", 	//是	NULL	入职时间
                id_card: "", //身份证号
                qq: "",	//qq
                email:"",	//邮箱
                note:"",	//备注
                password: ""
            },
            editStaff: {
                //修改对话框表单
                id: "",
                name:"",	//姓名
                phone:"",	//手机号
                sex: "",	//性别，0男，1女
                role: "",   //角色，1执行总助理，2财务经理...
                state:"",	//状态，0禁止，1正常
                address:"",	//是	NULL	地址
                create_time:"", 	//是	NULL	入职时间
                id_card: "", //身份证号
                qq: "",	//qq
                email:"",	//邮箱
                note:"",	//备注
                password: "",
                qq:''
            },
            detailStaff: {
                //详情对话框表单
                name:"",	//姓名
                phone:"",	//手机号
                sex: "",	//性别，0男，1女
                role: "",   //角色，1执行总助理，2财务经理...
                state:"",	//状态，0禁止，1正常
                address:"",	//是	NULL	地址
                create_time:"", 	//是	NULL	入职时间
                id_card: "", //身份证号
                qq: "",	//qq
                email:"",	//邮箱
                note:"",	//备注
                password: ""
            },
            staffSearch: {
                //搜索
                name: "", //姓名
                phone: "" //手机号
            },
            roleList: [
                {
                    role: 1,
                    roleValue: "超级管理员"
                },
                {
                    role: 2,
                    roleValue: "经理"
                },
                {
                    role: 3,
                    roleValue: "经理助理"
                },
                {
                    role: 4,
                    roleValue: "财务"
                },
                // {
                //     role: 4,
                //     roleValue: "品宣经理"
                // },
                // {
                //     role: 5,
                //     roleValue: "策划"
                // },
                // {
                //     role: 6,
                //     roleValue: "人事经理"
                // },
                // {
                //     role: 7,
                //     roleValue: "执行副总"
                // },
                // {
                //     role: 8,
                //     roleValue: "运营总经理"
                // },
                // {
                //     role: 9,
                //     roleValue: "运营总助理"
                // },
                // {
                //     role: 10,
                //     roleValue: "市场经理"
                // },
                // {
                //     role: 11,
                //     roleValue: "市场业务经理"
                // },
                // {
                //     role: 12,
                //     roleValue: "招商经理"
                // },
                // {
                //     role: 13,
                //     roleValue: "招商业务经理"
                // },
                // {
                //     role: 14,
                //     roleValue: "客服主管"
                // },
                // {
                //     role: 15,
                //     roleValue: "招商客服"
                // },
                // {
                //     role: 16,
                //     roleValue: "售后客服"
                // },
                // {
                //     role: 17,
                //     roleValue: "维护专员"
                // },
                // {
                //     role: 18,
                //     roleValue: "维修专员"
                // }
            ],
            sexFilterList: [
                {
                    text: "女",
                    value: 1
                },
                {
                    text: "男",
                    value: 0
                }
            ],
            stateFilterList: [
                {
                    text: "正常",
                    value: 1
                },
                {
                    text: "禁止",
                    value: 0
                }
            ],
            staffTable: [
                {
                    name: "人员1", //姓名
                    phone: "15247862354", //手机号
                    sex: "女", //性别
                    role: "人事经理", //角色
                    state: "正常", //状态
                    address: "南山分店", //地址
                    create_time: "2020-07-30" //入职时间
                },
                {
                    name: "人员2", //姓名
                    phone: "15384625973", //手机号
                    sex: "男", //性别
                    role: "运营总经理", //角色
                    state: "禁止", //状态
                    address: "南山分店", //地址
                    create_time: "2020-07-30" //入职时间
                },
                {
                    name: "人员3", //姓名
                    phone: "17426418539", //手机号
                    sex: "男", //性别
                    role: "市场经理", //角色
                    state: "正常", //状态
                    address: "南山分店", //地址
                    create_time: "2020-07-30" //入职时间
                }
            ],
            addRules: {
                // 表单验证
                name: [
                    {
                        required: true,
                        message: "请输入姓名",
                        trigger: "blur"
                    }
                ],
                create_time: [
                    {
                        required: true,
                        message: "请选择入职时间",
                        trigger: "change"
                    }
                ],
                phone: [
                    {
                        required: true,
                        message: "请输入手机号",
                        trigger: "blur"
                    }
                ],
                role: [
                    {
                        required: true,
                        message: "请输入角色",
                        trigger: "blur"
                    }
                ],
                sex: [
                    {
                        required: true,
                        message: "请选择性别",
                        trigger: "change"
                    }
                ],
                state: [
                    {
                        required: true,
                        message: "请选择状态",
                        trigger: "change"
                    }
                ],
                password: [
                    {required: true, message: "请设置登录密码",trigger: "blur"}
                ]
            }
        };
    },
    filters: {
        // 性别
        filsex(id){
            if(id === 0){
                id = "男士"
            }else if(id === 1){
                id = "女士"
            }else{ return }
            return id
        },
        // 状态
        filstate(id){
            if(id === 0){
                id = "禁止"
            }else if(id === 1){
                id = "正常"
            }else{return}
            return id
        },
        filrole(id){
            that.roleList.forEach((item)=>{
                id === item.role ? id = item.roleValue : "";
            })
            return id
        },
         // 时间
		formatDate(time){
			var date = new Date(time);
			return formatDate(date, 'yyyy-MM-dd');
		},
		formatDateBehind(time){
			var date = new Date(time);
			return formatDate(date, 'hh:mm:ss')
		}
    },
    methods: {
        searchClick(num) {
            // 查询
            let data = {page:this.currentPage,list_rows:this.currentCount};
            for(var i in this.staffSearch) this.staffSearch[i] !== "" ? data[i] = this.staffSearch[i] : "";
            // console.log(data)
            utils.request("/person/list","post",JSON.stringify(data)).then(resp=>{
                console.log(resp)
                if(resp.data.code === 200){
                    this.staffTable = resp.data.data.data;
                    this.pageResultSize = resp.data.data.total;
                    if(num === 2){
                        resp.data.data.total > 0 
                        ? this.$message({
                            message: "为您找到"+resp.data.data.total+"条人员信息",
                            type: "success"
                        }) : this.$message("没有符合条件的人员")
                    }
                }else{return}
            })
        },
        add() {
            // 添加
            this.addVisible = true;
        },
        confirmAdd() {
            // 确认添加
            console.log(this.addStaff.state);
            this.$refs["addStaff"].validate(valid => {
                if (valid) {
                    let that = this;
                    let data = {};
                    this.addVisible = false;
                    for(var i in that.addStaff) that.addStaff[i] !== "" ? String(data[i] = that.addStaff[i]) : "";
                    that.addStaff[i] = "";
                    data.create_time = timetamp(data.create_time);
                    console.log(data)
                    utils.request("/person/add","post",JSON.stringify(data)).then(resp=>{
                        console.log(resp)
                        if(resp.data.code === 200){
                            data.id = resp.data.data;

                            that.staffTable.length < that.currentCount ? that.staffTable.push(data) : "";
                            that.$message({
                                message: "员工添加成功！",
                                type: "success"
                            })
                        }else{return}
                    })
                } else {
                    console.log("error submit!!");
                    return false;
                }
            });
        },
        cancelAdd() {
            // 取消添加
            this.addVisible = false;
            this.$refs["addStaff"].resetFields();
            for(var i in this.addStaff) this.addStaff[i] = "";
        },
        closeAdd() {
            // 关闭添加对话框
            this.addVisible = false;
            for(var i in this.addStaff) this.addStaff[i] = "";
            this.$refs["addStaff"].resetFields();
        },
        sexFilterHandler(value, row, column) {
            // 性别筛选过滤事件
            const property = column["property"];
            return row[property] === value;
        },
        stateFilterHandler(value, row, column) {
            // 状态筛选过滤事件
            const property = column["property"];
            return row[property] === value;
        },
        edit(index, row) {
            // 修改
            for(var i in this.editStaff) this.editStaff[i] = row[i];
            this.editStaff.create_time !== "" ? this.editStaff.create_time = String(date(this.editStaff.create_time*1000)) : "";
            this.editStaff.index = index;
            console.log(this.editStaff)
            this.editVisible = true;
        },
        confirmEdit() {
            // 确认修改
            this.$refs.editStaff.validate(valid => {
                if (valid) {
                    let that = this;
                    let data = {};
                    let key = that.editStaff.index;
                    this.editVisible = false;
                    for(var i in that.editStaff) that.editStaff[i] !== "" && i !== "index" ? data[i] = that.editStaff[i] : "";
                    
                    that.editStaff[i] = "";
                    data.create_time !== "" ? data.create_time = timetamp(data.create_time) : "";
                    console.log(data)
                    utils.request("/person/update","post",JSON.stringify(data)).then(resp=>{
                        console.log(resp)
                        if(resp.data.code === 200){
                            that.staffTable.splice(key,1,data);
                            that.$message({
                                message: "员工信息修改成功！",
                                type: "success"
                            })
                        }else{return}
                    })
                } else {
                    console.log("error submit!!");
                    return false;
                }
            });
        },
        cancelEdit() {
            // 取消修改
            this.editVisible = false;
            for(var i in this.editStaff) this.editStaff[i] = "";
            this.$refs["editStaff"].resetFields();
        },
        closeEdit() {
            // 关闭修改对话框
            this.editVisible = false;
            for(var i in this.editStaff) this.editStaff[i] = "";
            this.$refs["editStaff"].resetFields();
        },
        detail(index, row) {
            // 详情
            for(var i in this.detailStaff) this.detailStaff[i] = row[i];
            this.detailVisible = true;
        },
        closeDetail(){
            // 关闭详情对话框
            this.detailVisible = false
        },
        delstaff(index, row) {
            // 删除
            // this.$router.push({ path: "/equipmentDetail", query: { row: row } });
            this.$confirm("此操作将永久该员工的所有信息, 是否继续?", '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
            }).then(() => {
                utils.request("/person/delete","post",JSON.stringify({id:row.id})).then(resp=>{
                    console.log(resp)
                    if(resp.data.code === 200){
                        this.staffTable.splice(index,1);    
                        this.$message({
                            type: 'success',
                            message: '删除成功!'
                        });
                    }else{return}
                });
            }).catch(() => {
                this.$message({
                    type: 'info',
                    message: '已取消删除'
                });          
            });
        },
        //   表格居中
        cellStyle: function({ row, column, rowIndex, columnIndex }) {
            return "text-align:center;";
        },
        rowClass: function({ row, rowIndex }) {
            return "text-align:center;";
        },
        allSelectionChange: function(val) {
            // 获取选中的内容
            console.log(val);
        },
        // 每页数据的数量
        pageCount: function(val) {
            this.currentCount = val;
            this.searchClick(1)
        },
        // 点击的第几页
        currentPageCount: function(val) {
            this.currentPage = val;
            this.searchClick(1)
        }
    },
    created() {
        let Base64 = require("js-base64").Base64;
        let menuarr = JSON.parse(Base64.decode(sessionStorage.getItem("menuarr")))
        for(var i=0;i<menuarr.length;i++){
            // console.log(menuarr[i].link)
            if(menuarr[i].link === this.$route.path){
                this.jurisdiction = menuarr[i]
            }else{}
        }
        this.searchClick(1);
    },
    beforeCreate() {
        that = this;
    },
};
</script>

<style lang="scss" scoped>
.flex,.flex-detail{
    display: flex;
    flex-flow: row wrap;
}
.flex-detail .el-form-item{
    width: 50%;
}
</style>

